@import '../../../var.scss';
.shareBox {
  display: flex;
  flex-direction: row;
  background-color: #ffffff;
  padding: 10rpx;
  border-radius: 6rpx;
}
.shareCover {
  width: 137rpx;
  height: 137rpx;
  overflow: hidden;
  margin-right: 10rpx;
  background-color: #f4f4f5;
  position: relative;
}
.topTip {
  position: absolute;
  top: 0;
  left: 0;
  padding: 5rpx 10rpx;
  background-color: #9999998c;
  /* width: 50rpx;
  height: 30rpx;
  text-align: ; */
}
.shareName {
  height: 137rpx;
  width: 300rpx;
  font-size: 30rpx;
  /* padding: 10rpx; */
  /* border-top: 1rpx solid #9999998c; */

  /* height: 105rpx; */
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.share {
}
.shareImg {
  min-width: 200rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.shareTitle {
  font-size: 30rpx;
  padding: 10rpx;
  border-top: 1rpx solid #9999998c;
}

.scroll_view,
.scroll_view_change {
  /*width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 150rpx;*/
  margin-bottom: 312rpx;
  background-color: #fff;
}

.scroll_view_X,
.scroll_view_change_X {
  margin-bottom: 175rpx;
  /* margin-bottom: 330rpx; */
}

.scroll_view_change {
  /*bottom: 440rpx;*/
  margin-bottom: 590rpx;
}

.message {
  /* width: 92%; */
  height: auto;
  padding: 0 30rpx;
  position: relative;
}

.time {
  margin: 14rpx 0;
  text-align: center;
}

.time .time-text {
  display: inline-block;
  padding: 6rpx 20rpx 0 20rpx;
  font-size: 24rpx;
  color: #fff;
  line-height: 28rpx;
  border-radius: 4rpx;
  background-color: #dcdcdc;
}

.user .user-text {
  margin: auto 100rpx 8rpx;
  font-size: 20rpx;
  color: #dcdcdc;
  display: block;
}

.avatar {
  width: 72rpx;
  height: 72rpx;
  margin: 0 20rpx 0 0;
  border-radius: 36rpx;
  overflow: hidden;
  float: left;
}

.msg {
  display: inline-block;
  max-width: calc(85% - 80rpx);
  min-height: 40rpx;
  font-size: 24rpx;
  /*overflow: hidden;*/
  text-align: left;
  word-break: break-all;
  background-color: #f7f7f7;
  border: 1px solid #dfe0e2;
  border-radius: 0 26rpx 26rpx 26rpx;
  position: relative;
  margin-top: 24rpx;
  &.text {
    padding: 20rpx;
  }
}

.msg .msg_poprightarrow {
  position: absolute;
  right: -10rpx;
  height: 18rpx;
  width: 18rpx;
  margin-top: -10rpx;
}

.msg .msg_popleftarrow {
  position: absolute;
  left: -14rpx;
  height: 18rpx;
  width: 18rpx;
  margin-top: -10rpx;
}

.msg .msg-text {
  line-height: 40rpx;
  font-size: 32rpx;
  margin: 0;
}
.msg .msg-video {
  width: 300rpx;
}
/*.msg:before {
	content: " ";
	position: absolute;
	top: 9px;
	right: 100%;
	border: 6px solid transparent;
	border-right-color: #EDEDED;
}*/

.self {
  text-align: right;
}

.self .avatar {
  float: right;
  margin: 0 0 0 20rpx;
}

.user {
  position: relative;
  bottom: -30rpx;
}

.self .msg {
  border-radius: 26rpx 0 26rpx 26rpx;
  background-color: $chat-background;
  border: 1px solid $chat-border;
  overflow: hidden;
  /* color: ; */
}

.self .msg:before {
  right: inherit;
  left: 100%;
  border-right-color: transparent;
  border-left-color: $chat-background;
}

.template {
  display: inline;
}
.err {
  width: 32rpx;
  height: 32rpx;
  position: absolute;
  left: -40rpx;
}
.hide {
  display: none;
}
.show {
  display: block;
}
